<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0,viewport-fit=cover">
<title></title>
{include file="common/pub_style" /}
<style type="text/css">
.weui-toast {height: 18.6em;}
.main-body {}
.login-body {background: #fff;	padding: 10px;	box-shadow: rgb(0 0 0/ 20%) 0 1px 5px 0px;}
@media only screen and (max-width: 600px) {
	.main-body {
		width: 100%;
		height: calc(100vh - 13vw);
		background-color: #ededed;
		position: fixed;
		top: 13vw;
		right: 0;
		z-index: 1;
		overflow-y: auto;
	}
}
.label {
	width: 30%;
    color: #333;
    flex-shrink: 0;
    font-size: 14px;
    text-align: left;
    font-weight: normal;
}
.item-row  {padding: 5px; justify-content: space-between;}
</style>
<script type="text/javascript">
$(document).ready(function() {
	isformnull();
	$(".login-btn").click(function() {			
		if (getformnull() ==0) {
			$("#loadingToast").show();
			$.ajax({
				type : 'post',
				url : "",
				dataType : "json",
				data : $("form").serialize(),
				success : function(res) {
					   layer.msg(res.msg);	
					   if (res.code ==99)
					     $("form").get(0).reset();
					   $("#loadingToast").hide();
					   $(".codeimg").attr('src',"{:url('captcha')}?t=" + Math.random());
				}
			});
		}
	})
})
</script>
</head>
<body>
	<div class="header-wrap">
		<div class='flex flex-between'>
			<div class='logo'>
				<img  src="{$website.thumb}">
			</div>
			{include file="common/lang" /}
		</div>
	</div>
	<div class=" pd20">
		<div class='login-body'>
			<form id="login-form" class="form-horizontal" action="" method="post">
				<div class="register-main">
					<div class="ok-auth register-part-main ">
						<div>
							<div class="loginBox">
								<div class="item-row align-center flex">
									<div class="label">{$Think.lang.account_title}:</div>
									<input type="text" name="username" class='input-text' maxlength="12" placeholder="{$Think.lang.reg_account_tips}" autocomplete="off">
								</div>
								<div class="item-row align-center flex">
									<div class="label">{$Think.lang.login_password}:</div>
									<input type="password" name="pwd1" class='input-text' maxlength="40" placeholder="{$Think.lang.reg_pwd_tips}" autocomplete="off">
								</div>								
								<div class="item-row align-center flex">
									<div class="label">{$Think.lang.confirm_password}:</div>
									<input type="password" maxlength="11" name="pwd2" class='input-text' placeholder="{$Think.lang.reg_confirm_pwd_tips}" autocomplete="off">
								</div>							
								<div class="item-row align-center flex">
									<div class="label">{$Think.lang.key_title}:</div>
									<input type="text" name="key" class='input-text' maxlength="12" placeholder="{$Think.lang.reg_key_tips}" autocomplete="off">
								</div>
								<div style="text-align: right;">&nbsp;</div>
								<div class="item-row align-center flex">
									<div class="label">{$Think.lang.verify_title}:</div>
									<input type="text" name="verify" placeholder="{$Think.lang.verify_title_tips}" style="width: 30%" autocomplete="off">									
								</div>
								<div class="item-row align-center flex">
								   <div class="label">&nbsp;</div>
								   <img class="codeimg" style="width: 40%" src="{:url('captcha')}" onclick="this.src='{:url('captcha')}?t='+ Math.random()"></div>
							</div>
							<div class="submit-btn-container">
								<button type="button" class="input-btn btnform okui-btn btn-md btn-fill-primary btn-disabled login-btn undefined">
									<span class="btn-content">
										<span>{$Think.lang.retrieve_password}</span>
									</span>
								</button>
							</div>
						</div>
					</div>
				</div>
			</form>
			<div class="text-center">
				<div class="pd20">
					<a href="{:url('login')}">{$Think.lang.return_login_page}</a>
				</div>
			</div>
		</div>
	</div>
	{include file="common/footer" /}
</body>
</html>